/**
 * 参考：https://www.cnblogs.com/guiyishanren/p/10657910.html
 * Vuex 依赖 Promise
 */
import Vue    from 'vue'
import Vuex   from 'vuex'
import Cookies from 'js-cookie';			// https://www.cnblogs.com/gopark/p/13743364.html
import doData from '../plugins/utils/doData'

Vue.use(Vuex);

/**
 * 创建Vuex实例
 * Vuex全局状态管理
 * FIXME 页面刷新后 state 的值会重置
 */
const store = new Vuex.Store({
	/**
	 * 存放状态,不能直接修改
	 * @use store.state.key
	 */
	state: {
		Token: null,			// 令牌
		user: {},				// 用户信息
		menu: {},				// 菜单信息
		router: {},				// 路由信息
	},
	
	/**
	 * 改变、突变
	 * 更改状态的逻辑，【同步操作】
	 * @use store.commit('MUTATIONS', payload) 只有两个参数
	 */
	mutations: {
		// 登录
		login(state, user) {
			state.Token = user.Token;
			state.user = user;                                                                                                             
			Cookies.set('Token', doData.md5(user.Token || ''), {expires: new Date(new Date().getTime() + 60 * 1000 * 30)}); // 有效期是30分钟
			Cookies.set('user', JSON.stringify(user));
		},
		// 退出
		logout(state) {
			store.commit('login', {});
			Cookies.remove('Token');
			Cookies.remove('user');
			sessionStorage.clear();
		},
	},

	
	/**
	 * Getter相当于vue中的computed计算属性
	 * state的计算属性 store.getters.doneTodos
	 * 输出：
	 */
	getters: function() {
		doneTodos: (state, getters) => {
			return state;
		}
	},
	
	/**
	 * 注册actions 类似vue里的methods
	 * action函数接受一个context参数，这个context具有与store实例相同的方法和属性。
	 * 提交mutation，【异步操作】
	 * @use store.dispatch('action', payload)
	 */
	actions: {
		login(context) {
			context.commit('login');
		}
	},

	/**
	 * 将store模块化
	 * module是为了将store拆分后的一个个小模块，这么做的目的是因为当store很大的时候，分成模块的话，方便管理。
	 * 每个module拥有自己的state, getters, mutation, action
	 * 模块化请看 module 文件夹
	 */
	mudules: {

	}
});
// console.log('%c store.js', 'color:red');

// 处理页面刷新后的问题
if (Cookies.get('Token') && Cookies.get('user')) {
	store.commit('login', JSON.parse(Cookies.get('user')));
}
console.warn('=========================================================================== store')
// 导出store对象
export default store;

